<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>部门薪资统计</title>
<link rel="stylesheet" href="../public/layui/css/layui.css" media="all">
<script src="../public/layui/layui.js" charset="utf-8"></script>
</head>
<body>
<%if(session.getAttribute("user")==null){ %>
    <script>
		window.top.location.replace("../login.jsp");
	</script>
<%}%>
<div>
	<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
		<legend><h2  style="color:#c2c2c2"><span id="deptname" style="color:#393D49"></span>薪资统计</h2></legend>
	</fieldset>
	<table class="layui-hide" id="demo" lay-filter="form"></table>
	
	<!-- 头部工具栏 -->
	<script type="text/html" id="search">
 		 
			条件搜索：
		<div class="layui-inline">
	  	  <select id="condition" name="condition">
        	<option value=""></option>
        	<option value="rolename">按职位</option>
		  </select>
	 	 </div>
  		<div class="layui-inline">
    		<input class="layui-input" id="conditionValue" name="conditionValue" autocomplete="off">
  		</div>
  			<button class="layui-btn" name="search" data-type="reload"  lay-event="search">搜索</button>
	</script>
	<!-- 	薪资状态 -->
	<script type="text/html" id="salaryStatus">
		{{#  if(d.ispay == "0"){ }}
				<div style="color:#FF5722; ">暂未发放</div>
  		{{#  } else { }}
   	 			<div style="color:#009688; ">已发放</div>
  		{{#  } }}
	</script>
	<!-- 非市场部的行级工具栏 -->
	<script type="text/html" id=barDemo>
		{{#  if(d.ispay == "0"){ }}
			<button class="layui-btn layui-btn-danger layui-btn-xs" lay-event="inputPunishing">录入请假旷工情况</button>
  			<button class="layui-btn layui-btn-xs" lay-event="getBonus">给他申领奖金福利</button>
  		{{#  } else { }}
   	 		<button class="layui-btn layui-btn-danger layui-btn-xs layui-btn-disabled" lay-event="">录入请假旷工情况</button>
  			<button class="layui-btn layui-btn-xs layui-btn-disabled" lay-event="">给他申领奖金福利</button>
		{{#  } }}
	</script>
<!-- 	市场部的行级工具栏  -->
	<script type="text/html" id=barDemo2>
		{{#  if(d.ispay == "0"){ }}
			<button class="layui-btn layui-btn-danger layui-btn-xs" lay-event="inputPunishing">录入请假旷工情况</button>
			<button class="layui-btn layui-btn-normal layui-btn-xs" lay-event="inputCommission">录入销售提成</button>
  			<button class="layui-btn layui-btn-xs" lay-event="getBonus">给他申领奖金福利</button>
  		{{#  } else { }}
   	 		<button class="layui-btn layui-btn-danger layui-btn-xs layui-btn-disabled" lay-event="">录入请假旷工情况</button>
			<button class="layui-btn layui-btn-normal layui-btn-xs layui-btn-disabled" lay-event="">录入销售提成</button>
  			<button class="layui-btn layui-btn-xs layui-btn-disabled" lay-event="">给他申领奖金福利</button>
		{{#  } }}
	</script>
	<script type="text/javascript">
	var shichangbuId = 50;	//市场部部门id
	var col = [ //表头
	      {field: 'userid', title: '员工编号', width:120, sort: true,fixed: 'left'}
	      ,{field: 'name', title: '员工姓名', width:200} 
	      ,{field: 'status', title: '员工状态', width:150, templet:'#statusTpl', sort: true}
	      ,{field: 'deptname', title: '所属部门', width:100}
	      ,{field: 'rolename', title: '职位', width: 180}
	      ,{field: 'ispay', title: '发放状态', width:200, sort: true ,templet:'#salaryStatus'}
	      ,{field: 'totalwages', title: '总薪资', width:200, sort: true}
	      ,{field: 'basewages', title: '基本薪资', width:200, sort: true}
	      ,{field: 'meritwages', title: '额外薪资', width:200, sort: true}
	      ,{field: 'punishingwages', title: '扣除薪资', width:200, sort: true}
	      ,{field: 'commission', title: '（市场部人员特有）销售提成', width:200, sort: true,hide: true}
	      ,{field: 'overtimestandard', title: '加班薪资标准', width:200, sort: true} 
	      ,{field: 'overtime', title: '普通加班时长（单位小时）', width:200, sort: true} 
	      ,{field: 'weekovertime', title: '周末加班时长（单位小时）', width: 200, sort: true}
	      ,{field: 'festovertime', title: '节假日加班时长（单位小时）', width: 220, sort: true}
	      ,{field: 'leavestandard', title: '请假扣薪标准', width:200, sort: true} 
	      ,{field: 'leavecount', title: '请假次数', width:200, sort: true}
	      ,{field: 'absentstandard', title: '旷工扣薪标准', width:200, sort: true} 
	      ,{field: 'absentcount', title: '旷工次数', width:200, sort: true}
	      ,{fixed: 'right', width:400, align:'center', toolbar: '#barDemo'} //这里的toolbar值是模板元素的选择器
	    ];
	
	layui.use(['table', 'jquery','layer'],function(){
		$ = layui.jquery;
		var table = layui.table;
		var layer = layui.layer;
		var isReaload = false;//是否已经判断后重新渲染过一次
		
		var tableIns = table.render({
			done: function(res, curr, count){
// 				alert(JSON.stringify(res));
				document.getElementById("deptname").innerText = "${sessionScope.user.deptname }";
				//回调函数----------通过deptid判断如果是市场部职工，则修改hide为false显示该字段
				if(res.data[0].deptid == shichangbuId && isReaload == false){
					isReaload = true;
					col[9].hide = false;
					col[18].toolbar = barDemo2;
					tableIns.reload({	//只重新渲染可以不重新请求数据
// 						  url: '../ManagerServlet?button=1'
					  });
				}
			}
			,elem: '#demo'
		    ,height: 600
		    ,url: '../ManagerServlet?button=1' //数据接口
		    ,toolbar: '#search'
	    	,page: true //开启分页
	    	,parseData: function(res){ //res 即为原始返回的数据
	    	    return {
	    	      "code": res.code, //解析接口状态
	    	      "msg": res.msg, //解析提示文本
	    	      "count": res.count, //解析数据长度
	    	      "data": res.data //解析数据列表
	    	    };
	    	}
		    ,page: true //开启分页
		    ,cols: [col]
		    ,defaultToolbar:["print"]
		});
		
		 // 顶部工具栏事件
		  table.on('toolbar(form)', function(obj){
// 			  var checkStatus = table.checkStatus(obj.config.id);
			  var data = obj.data;
			  var conditionValue = $('#conditionValue');
	    	  var condition = $('#condition');
	    	  if(conditionValue.val().length != 0){
	    		  if(condition.val() == "rolename"){
		    		  layer.msg("按职位搜索到与\""+conditionValue.val()+"\"相关结果如下！");
		    	  }else{
		    		  layer.msg("请先选择搜索类型！");
// 		    		  layer.msg(conditionValue.val().length); //看变量数据的长度，实测有效
		    	  }
	    	  }else{
	    		  layer.msg("显示全部！");
	    	  }
		      //这里以搜索为例
	    	  tableIns.reload({
				  url: '../ManagerServlet?button=1'
				  ,where: { //设定异步数据接口的额外参数，任意设
				    	"condition": condition.val(),
				    	"conditionValue": conditionValue.val(),
				    	"page":"1",
				    	"limit":"10"
				    }
			  });
			});
		 //监听侧边工具条
		 table.on('tool(form)',function(obj){
			 var data = obj.data;
			 var layEvent = obj.event;
			 var operater = data.userid;
			 if(layEvent === 'inputPunishing'){
// 				 layer.msg(operater);
				 layer.open({
					 type:2,
					 title:"录入请假旷工情况",
					 area: ['850px', '500px'],
					 maxmin: true, //开启最大化最小化按钮
					 shadeClose: true,
					 content: "02inputPunishing.jsp?operater="+ operater,
					 end: function(){
						  $(".layui-laypage-btn").click();
					  }
				 });
			 }else if(layEvent === 'inputCommission'){
// 				 layer.msg(operater);
				 layer.open({
					 type:2,
					 title:"提成录入",
					 area: ['850px', '500px'],
					 maxmin: true, //开启最大化最小化按钮
					 shadeClose: true,
					 content: "04inputCommisson.jsp?operater="+ operater,
					 end: function(){
						  $(".layui-laypage-btn").click();
					 }
				 });
			 }else if(layEvent === 'getBonus'){
// 				 layer.msg(operater);
				 layer.open({
					 type:2,
					 title:"申领福利",
					 area: ['850px', '500px'],
					 maxmin: true, //开启最大化最小化按钮
					 shadeClose: true,
					 content: "03inputBonus.jsp?operater="+ operater,
					 end: function(){
						  $(".layui-laypage-btn").click();
					  }
				 });
			 }
		 });
		 
	});

	</script>
	<script type="text/html" id="statusTpl">
  		{{#  if(d.status == 0){ }}
   	 			<span style="color:#FFB800;">停职</span>
  		{{#  } else { }}
    	        <span style="color:#5FB878;">正常在职</span>
  		{{#  } }}
	</script>
</div>
</body>
</html>